<%--
  Created by IntelliJ IDEA.
  User: 施明
  Date: 2019/5/21
  Time: 20:27
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<c:set var="path" value="${pageContext.request.contextPath}"></c:set>
<head>
    <meta charset="utf-8">
    <title>员工列表</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

    <link rel="stylesheet" href="${path}/layuiadmin/style/admin.css" media="all">


    <link rel="stylesheet" href="${path}/layuiadmin/layui/css/layui.css" media="all">


</head>

<body>
<div class="layui-form-item">

    <div class="layui-inline">

    </div>
</div>

<!-- 添加活动信息的表单 -->
<div id="addemployee" style="display: none">
    <!-- 这里给一个弹出表单 -->
    <form class="layui-form" lay-filter="example">
        <div class="layui-form-item">
            <label class="layui-form-label">活动名</label>
            <div class="layui-input-block">
                <input type="text" name="flashsalename" id="flashsalename" lay-verify="title"
                       autocomplete="off" placeholder="请输入活动名"
                       class="layui-input">
            </div>
        </div>


        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">开始时间</label>
                <div class="layui-input-inline">
                    <input type="text" class="layui-input" id="flashsalestartime" placeholder="yyyy-MM-dd HH:mm:ss" name="flashsalestartime">
                </div>
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">结束时间</label>
                <div class="layui-input-inline">
                    <input type="text" class="layui-input" id="flashsaleendtime" placeholder="yyyy-MM-dd HH:mm:ss" name="flashsaleendtime">
                </div>
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-input-block">
                <button class="layui-btn btn-update" type="button" lay-submit=""
                        lay-filter="demo1">保存
                </button>
            </div>
        </div>
    </form>
</div>

<!-- 编辑活动信息 -->
<div id="editactivity" style="display:none">
    <form class="layui-form" lay-filter="example">
        <div class="layui-form-item">
            <label class="layui-form-label">订单编号</label>
            <div class="layui-input-block">
                <input type="text" name="orderid1" id="orderid1" lay-verify="title"
                       autocomplete="off" readonly
                       class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
        <label class="layui-form-label">商品名</label>
        <div class="layui-input-block">
            <input type="text" name="goodsname" id="goodsname1" lay-verify="title"
                   autocomplete="off"  readonly
                   class="layui-input">
        </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">收货人</label>
            <div class="layui-input-block">
                <input type="text" name="username" id="username1" lay-verify="title"
                       autocomplete="off" placeholder="下单用户"
                       class="layui-input">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">联系方式</label>
            <div class="layui-input-block">
                <input type="text" name="userphone" id="userphone1" lay-verify="title"
                       autocomplete="off" placeholder="请输入手机号"
                       class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">收货地址</label>
            <div class="layui-input-block">
                <input type="text" name="useraddress" id="useraddress" lay-verify="title"
                       autocomplete="off" placeholder="请输入收货地址"
                       class="layui-input">
            </div>
        </div>
        <div class="layui-form-item" id="orderState">
            <label class="layui-form-label">状态</label>
            <div class="layui-input-block" id="flashorderstatus1">
                <input type="radio" name="flashorderstatus" id="flashorderstatus11" value="0" title="开始" checked="">
                <input type="radio" name="flashorderstatus" id="flashorderstatus12" value="1" title="已结束">
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-input-block">
                <button class="layui-btn btn-update" type="button" lay-submit=""
                        lay-filter="demo2">保存
                </button>
            </div>
        </div>
    </form>
</div>

<table class="layui-hide" id="test" lay-filter="test"></table>

<script type="text/html" id="toolbarDemo">
    <div class="layui-btn-container">

        <%--<button class="layui-btn layui-btn-sm" lay-event="add">添加活动</button>--%>
    </div>
</script>

<script type="text/html" id="barDemo">

    <a class="layui-btn layui-btn-xs" lay-event="change" title="修改信息">修改信息</a>

</script>
<script src="https://cdn.bootcss.com/jquery/3.0.0-rc1/jquery.js"></script>
<script src="${path}/layuiadmin/layui/layui.js"></script>

<script>

     layui.use('table', function () {
        var table = layui.table;
        table.render({
            elem: '#test'
            , url: '${path}/adminflashorder.action/showflashordermessagebypage' //数据接口
            , toolbar: '#toolbarDemo',
            title: '秒杀订单表',
            cols: [
                [
                      {field: 'orderNum', width: 190, title: '订单号', sort: true}
                    , {field: 'orderdata', title: '下单时间', width: 150}
                    , {field: 'goodname', width: 120, title: '商品名字'}
                    , {field: 'surepice', width: 80, title: '秒杀价'}
                    , {field: 'sureshopnum', width: 80, title: '数量'}
                    , {field: 'sureusername', width: 80, title: '收货人'}
                    , {field: 'sureusertel', width: 180, title: '联系方式'}
                    , {field: 'address', width: 220, title: '收货地址'}
                    , {
                    field: 'orderstatus', title: '状态', templet: function (res) {
                        //alert("res.orderstatus:"+res.orderstatus)
                        if(res.orderstatus == 0){
                            return "买家未付款";
                        }else if(res.orderstatus == 1){
                            return "未发货";
                        }else if(res.orderstatus == 2){
                            return "买家未确认收货";
                        }else{
                            return "交易完成";
                        }
                       // return res.orderstatus == 0 ? "买家未付款" : res.orderstatus == 1 ? "未发货":res.orderstatus == 2?"买家未确认收货":"交易完成";
                    }
                }
                    , {fixed: 'right', title: '操作', toolbar: '#barDemo', width: 150}
                ]
            ],
            page: true,
            id: 'testReload'
        });



        //头工具栏事件
        table.on('toolbar(test)', function (obj) {
            var checkStatus = table.checkStatus(obj.config.id);
            switch (obj.event) {
                case 'add':
                    var data = checkStatus.data;
                    layer.open({
                        type: 1,
                        content: $("#editactivity"),//这里弹出的内容是div的id为addemployee
                        title: '添加秒杀活动信息',
                        area: ['450px', '380px']
                    });
                    break;

            }
            ;
        });

        //ajax添加提交事件,  此处搭配添加操作弹出层
        layui.form.on('submit(demo1)', function (data) {


        });

        //监听行工具事件
        table.on('tool(test)', function (obj) {
            var data = obj.data;
            if(obj.event === 'change'){
               $("#orderid1").attr("value",data.orderNum)//订单号
                $("#goodsname1").attr("value",data.goodname)//商品名
                $("#username1").attr("value",data.sureusername)//收货人
                $("#userphone1").attr("value",data.sureusertel)//联系人
                $("#useraddress").attr("value",data.address)//收货地址
                var state = data.orderstatus;//订单状态
                //状态的判断
                $("#flashorderstatus1").empty()
                    if(state == 0 ){//买家未付款
                    $("#flashorderstatus1").append('<input type="radio" name="flashorderstatus" id="flashorderstatus11" value="0" title="未付款" checked="">')
                  }else if(state == 1 ){
                        $("#flashorderstatus1").append('<input type="radio" name="flashorderstatus" id="flashorderstatus11" value="1" title="已付款" checked="">'+
                            '<input type="radio" name="flashorderstatus" id="flashorderstatus12" value="2" title="发货">')
                    }else if(state == 2){
                        $("#flashorderstatus1").append('<input type="radio" name="flashorderstatus" id="flashorderstatus11" value="2" title="买家未确认收货" checked="">')
                    }else if(state == 3){
                        $("#flashorderstatus1").append('<input type="radio" name="flashorderstatus" id="flashorderstatus11" value="3" title="交易完成" checked="">')
                    }

                //添加一个弹出层
                var index1 = layer.open({
                    type: 1,
                    content: $("#editactivity"),//这里弹出的内容是div的id为edituser
                    title: '修改订单信息',
                    area: ['500px', '420px']

                });
                layui.form.render();//这个是表单的render，用于处理单选框、按钮、多选框不能被选中的问题

            }
        });
        layui.form.on('submit(demo2)', function (data4) {

            var data = {
                ordernum: data4.field.orderid1,
                goodsname: data4.field.goodsname,
                username: data4.field.username,
                userphone: data4.field.userphone,
                useraddress: data4.field.useraddress,
                flashorderstatus: data4.field.flashorderstatus
            };
            $.ajax({
                type: "post",
                url: "${path}/adminflashorder.action/updateflashordermessage",
                data: JSON.stringify(data),
                contentType: "${path}/application/json;charset=UTF-8",
                success: function (cm) {
                    layer.msg(cm.msg, {
                        time: 1000,
                    }, function () {
                        if (cm.msg == "修改成功") {

                            layer.msg('修改成功', {
                                icon: 1, time: 2000
                            }, function () {
                                layer.closeAll();
                                location.reload('testReload');
                            });

                        } else {
                            layer.msg('修改失败', {
                                icon: 1,
                                time: 1500
                            });
                        }
                    });
                }
            });

            return false;
        });
    });

    layui.use('laydate', function () {
        var laydate = layui.laydate;
        //常规用法
        laydate.render({
            elem: '#flashsaleendtime'
            , type : 'datetime'
        });
        //常规用法
        laydate.render({
            elem: '#flashsalestartime'
            , type : 'datetime'
        });

    });
</script>

</body>

</html>
